<template>
  <div class="header">
    <div class="logo">
      <img class="logo_img" src="../../../assets/wltx_logo.jpg" alt="" />
      <div style="font-family: 'SimHei'">{{ name }}</div>
      <el-divider class="divider" direction="vertical" />
      <div class="sys_name">{{ sys_name }}</div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      name: 'xxx',
      sys_name: '图书馆校外资源访问系统',
    }
  },
  components: {},
  methods: {},
}
</script>

<style lang="less" scoped>
.header {
  height: 6vh;
  line-height: 6vh;
  background-color: #005595;
  padding: 5px 0;
  font-size: 1.5em;
  .logo {
    display: flex;
    align-items: center;
    padding-left: 18vw;
    color: #ffffff;
    .logo_img {
      height: 6vh;
      border-radius: 50%;
      margin-right: 10px;
    }
    .divider {
      margin: 0 20px;
      font-size: 32px;
      font-weight: 100;
      // color: #488cb8 !important;
      transform: scale(0.65);
    }
    .sys_name {
      font-size: 0.7em;
      font-weight: 400;
      // font-family: 'NSimSun';
    }
  }
}
</style>
